<template>
    <j-modal :title="title" :width="1200" :visible="visible" :maskClosable="false" switchFullscreen @ok="handleOk"
        :okButtonProps="{ class: { 'jee-hidden': disableSubmit } }" @cancel="handleCancel">
        <a-table ref="table" size="middle" bordered rowKey="id" class="j-table-force-nowrap" :scroll="{ x: true }"
            :columns="columns" :dataSource="dataSource" :pagination="ipagination" :loading="loading"
            @change="handleTableChange"
            :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange, type: 'radio' }">
            <template slot="htmlSlot" slot-scope="text">
                <div v-html="text"></div>
            </template>
        </a-table>
    </j-modal>
</template>

<script>
import { JeecgListMixin } from '@/mixins/JeecgListMixin'

export default {
    name: 'YuDingListModal',
    mixins: [JeecgListMixin],
    data() {
        return {
            title: '已确认和已分房预定列表',
            width: 800,
            visible: false,
            disableSubmit: false,
            queryParam: {
                bookStatus: '10,20',
            },
            url: {
                list: "/room/roomBookInfo/list",
            },
            columns: [
                {
                    title: '#',
                    dataIndex: '',
                    key: 'rowIndex',
                    width: 60,
                    align: "center",
                    customRender: function (t, r, index) {
                        return parseInt(index) + 1;
                    }
                },
                {
                    title: '预订单号',
                    align: "center",
                    dataIndex: 'bookCode'
                },
                {
                    title: '预订状态',
                    align: "center",
                    dataIndex: 'bookStatus_dictText'
                },
                {
                    title: '预定类型',
                    align: "center",
                    dataIndex: 'bookType_dictText'
                },
                {
                    title: '预定人',
                    align: "center",
                    dataIndex: 'bookPerson'
                },
                {
                    title: '预定时间',
                    align: "center",
                    dataIndex: 'bookDate'
                },
                {
                    title: '联系电话',
                    align: "center",
                    dataIndex: 'photo'
                },
                {
                    title: '最早来期',
                    align: "center",
                    dataIndex: 'dateArrival'
                },
                {
                    title: '最晚离期',
                    align: "center",
                    dataIndex: 'dateDeparture'
                },
                {
                    title: '预收金额',
                    align: "center",
                    dataIndex: 'receiptAmt'
                },
                {
                    title: '房间分配',
                    align: "center",
                    dataIndex: 'roomFpDesc',
                    scopedSlots: { customRender: 'htmlSlot' }
                },
            ],
        }
    },
    methods: {
        show() {
            this.visible = true
        },
        close() {
            this.$emit('close');
            this.visible = false;
        },
        handleOk() {
            this.$emit('handleSelectYuding', this.selectionRows[0])
            this.close()
        },

        handleCancel() {
            this.close()
        }
    }
}
</script>

<style scoped></style>